.topinfo
{
	padding: 30rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	// margin-top: 30rpx;
	.img
	{
		width: 200rpx;
		height: 284rpx;
	}
	display: flex;
	align-items: center;
	// padding: 20rpx;
	box-sizing: border-box;
	.imgbox
	{
		width: 180rpx;
		height: 256rpx;
		border-radius: 20rpx;
		position: relative;
		.img
		{
			width: 100%;
			height: 100%;
		}
		.label
		{
			width: 116rpx;
			height: 32rpx;
			position: absolute;
			left: 0;
			top: 0;
			.labelbody
			{
				position: relative;
				image
				{
					width: 100%;
					height: 32rpx;
					vertical-align: top;
				}
				.labelname
				{
					position: absolute;
					left: 0;
					top: 0;
					width: 90%;
					height: 32rpx;
					line-height: 32rpx;
					text-align: center;
					font-size: 20rpx;
					color: #FFFFFF;
				}
			}
		}
	}
	.info
	{
		margin-left: 30rpx;
		width: 480rpx;
		.name
		{
			display: flex;
			align-items: center;
			.tip
			{
				width: 32rpx;
				height: 32rpx;
				text-align: center;
				line-height: 32rpx;
				background-color: #FFF29A;
				color: #312C39;
				font-size: 20rpx;
				border-radius: 6rpx;
			}
			.n_name
			{
				font-size: 32rpx;
				font-weight: bold;
				color: #FFFFFF;
				margin-left: 15rpx;
			}
		}
		.mark
		{
			display: flex;
			flex-wrap: wrap;
			margin-top: 20rpx;
			.markname
			{
				padding: 4rpx 8rpx;
				border-radius: 4rpx;
				background-color: #47424F;
				color: #FFFFFF;
				font-size: 20rpx;
				text-align: center;
				margin-right: 15rpx;
				margin-bottom: 15rpx;
			}
		}
		.faxing
		{
			margin-top: 20rpx;
			color: #9F9F9F;
			font-size: 20rpx;
		}
		.bom
		{
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 30rpx;
			.price
			{
				font-size: 36rpx;
				font-weight: bold;
				color: #FFF29A;
				text
				{
					font-size: 26rpx;
					font-weight: 100;
				}
				.ren
				{
					font-size: 22rpx;
				}
			}
			.menu
			{
				margin-top: 10rpx;
				display: flex;
				.menuitem
				{
					display: flex;
					align-items: center;
					margin-right: 30rpx;
					.menuimg
					{
						width: 24rpx;
						height: 24rpx;
					}
					text
					{
						font-size: 22rpx;
						color: #FFF29A;
						margin-left: 10rpx;
					}
				}
			}
		}
	}
}

.markinfo
{
	padding: 0 30rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	margin-top: 10rpx;
	.item
	{
		width: 228rpx;
		height: 120rpx;
		position: relative;
		.bgimg
		{
			width: 100%;
			height: 100%;
		}
		.iteminfo
		{
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			color: #FFFFFF;
			.top
			{
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 24rpx;
				image
				{
					width: 30rpx;
					height: 30rpx;
					margin-right: 10rpx;
				}
			}
			.bom
			{
				font-size: 32rpx;
				font-weight: 500;
				margin-top: 10rpx;
			}
		}
	}
}
.index-bot{
	padding: 40rpx;
	.bot-one{
		margin-bottom: 40rpx;
	}
	.index-title{
		margin-bottom: 36rpx;
		display: flex;
		align-items: center;
		.index-line{
			width: 4rpx;
			height: 32rpx;
			border-radius: 22rpx;
			margin-right: 20rpx;
			background-color: #FFF29A;
		}
		.index-text{
			font-size: 32rpx;
			color: #FFF29A;
		}
	}
	.money{
		display: flex;
		align-items: center;
		justify-content: space-between;
		.index-money{
			display: flex;
			align-items: center;
		}
		.money-switch{
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
	.index-time{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
		.time-left{
			border: 1rpx solid #FFF29A;
			width: 420rpx;
			padding: 0 30rpx;
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-radius: 100rpx;
			.left-input{
				color: #fff;
				position: relative;
				.input-text{
					position: absolute;
					left: 30rpx;
					top: 20rpx;
					z-index: 99;
				}
			}
			image{
				width: 40rpx;
				height: 40rpx;	
				margin-left: 10rpx;
			}
		}
		.time-right{
			width: 220rpx;
			height: 80rpx;
			border: 1rpx solid #FFF29A;
			border-radius: 100rpx;
			padding: 0 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			image{
				width: 40rpx;
				height: 40rpx;
			}
			.right-text{
				color: #FFF29A;
				font-size: 28rpx;
			}
		}
}	
.index-btn{
	width: 630rpx;
	margin: 0 auto;
	height: 96rpx;
	text-align: center;
	line-height: 96rpx;
	background-color: #FFF29A;
	color: #312C39;
	font-size: 32rpx;
	border-radius: 8rpx;
}

.light-index{
	background: #fff;
	height: 100%;
}
.light-tip{
	background: #ff7664 !important;
	color: #fff !important;
}
.light-n_name{
	color: #333 !important;
}
.light-markname{
	background: #ffa573 !important;
	color: #fff;
}
.light-price{
	color: #ff4d62 !important;
}
.light-played{
	color: #ffa552 !important;
}
.light-333{
	color: #333 !important;
}
.light-index-line{
	background: #ff9d66 !important;
}
.light-left-input{
	border: 2rpx solid #ff9d66 !important;
}
.light-right-text{
	color: #FF9D66 !important;
}
.light-index-btn{
	background: #ff9d66 !important;
	color: #fff !important;
}